@import "src/sass/global/mixin";

.-immy-loading{
  @include opacity(0)
}
.-immy-loading-mask{
  position:fixed;
  left:0;
  top:0;
  right:0;
  bottom:0;
  background:rgba(0, 0, 0, 0);
  text-align: center;
  z-index: 99999;
}
.-immy-loading-mask.busy{
  background:rgba(0, 0, 0, 0);
}
.-immy-loading-mask.busy .icon{
  display: block;
}
.-immy-loading-mask .icon{
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
}
.-immy-loading-mask img{
  display: block;
  margin-top: -50%;
  margin-left: -50%;
  padding: 18px;
  background: rgba(0,0,0,0.5);
  width: 60px;
  height: 60px;
  border-radius: 5px;
}
.-immy-hide{
  visibility: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  left: -100%;
  top: -100%;
}
.-immy-hide>*{
  position: absolute;
}
.-immy-dialog-mask {
  position: absolute;
  z-index: 1001;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
}

.-immy-dialog-window {
  position: fixed;
  z-index: 1002;
  border-radius: 5px;
  background: #FFF;
  box-shadow: 0 0 3px rgba(0, 0, 0, .2);
  overflow: hidden;
}
 .pdom-turnContainer > .panel {
    margin-bottom: 0;
    border: none;
    border-radius: 0;
    -webkit-box-shadow:none;
    box-shadow:none;
 }
.-immy-dialog-header {
  color: #CCC;
  //border-bottom: #FFF 1px solid;
  font-size: 12px;
}

.-immy-dialog-content {
  background: #fff;
  border-radius: 0 0 5px 5px;
  overflow: hidden;
  position: relative;
}

.-immy-dialog-header{
}
.-immy-dialog-header .subject {
  overflow: hidden;
  font-weight: bold;
  font-size: 15px;
  padding-left: 15px;
  padding-right: 15px;
  margin: 0;
}

.-immy-dialog-header .button {
  display: block;
  padding-left: 25px;
  height: 25px;
  cursor: pointer;
}

//.-immy-dialog-header .button:hover {
//  background-position: 8px -36px;
//  color: #ff6c14;
//  text-decoration: none;
//}

.-immy-dialog-header .controls {
  position: absolute;
  right: 5px;
  top: 0;
  z-index: 35;
}
.-immy-dialog-header{
  height: 0;
}
.-immy-dialog-header .tools {
  position: absolute;
  left: 5px;
  top: 0;
  z-index: 35;
}

.-immy-dialog-header .tool-undo {
  width: 9px;
  height: 15px;
  margin-top: 8px;
  padding-left: 0;
  margin-left: 5px;
  @include background('/images/ui/rollback.png',9px,15px,center,top);
}

.-immy-dialog-header .tool-redo {
  background-image: url(imgs/ico_front4.png);
}

.-immy-dialog-header .tool-refresh {
  background-image: url(imgs/ico_refresh4.png);
}

.-immy-dialog-header .tool-close {
  color: $lightgray;
  height:0;
  margin-top: 10px;
  margin-right: 8px;
  padding-left:0;
}
.-immy-dialog-header .tool-close:hover {
  color: $gray;
}
.icon-cross{
  font-size:12px;
}

.-immy-dialog-header .tool-add {
  background-image: url(imgs/ico_add4.png);
}

.-immy-layer {
  width: 90%;
}

.-immy-loader{
  position: relative;
  overflow: hidden;
}
.-immy-loader-card {
  position: absolute;
  top: 40px;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
}

.-immy-loader-panel {
  position: absolute;
  width: 200%;
  height: 100%;
  transform: none;
  -webkit-transform: none;
  transition: transform 100ms ease-in-out 0s;
  -webkit-transition: -webkit-transform 100ms ease-in-out 0s;
  -ms-transition: -ms-transform 100ms ease-in-out 0s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.-immy-loader-page {
  position: absolute;
  width: 50%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.-immy-loader-in {
  left: -100%;
}

.-immy-loader-in .-immy-loader-cur {
  left: 50%;
}

.-immy-loader-out .-immy-loader-old {
  left: 50%;
}

.-immy-loader-in.-immy-loader-transform {
  transition: none !important;
  -webkit-transition: none !important;
  -ms-transition: none !important;
  transform: translate3d(50%, 0px, 0px);
  -webkit-transform: translate3d(50%, 0px, 0px);
  -ms-transform: translate3d(50%, 0px, 0px);
}

.-immy-loader-out.-immy-loader-transform {
  transition: none !important;
  -webkit-transition: none !important;
  -ms-transition: none !important;
  transform: translate3d(-50%, 0px, 0px);
  -webkit-transform: translate3d(-50%, 0px, 0px);
  -ms-transform: translate3d(-50%, 0px, 0px);
}

.-immy-loader-reload {
  transition: none !important;
  -webkit-transition: none !important;
  -ms-transition: none !important;
  transform: translate3d(0, 15px, 0px);
  -webkit-transform: translate3d(0, 15px, 0px);
  -ms-transform: translate3d(0, 15px, 0px);
}

.-immy-dialog-window{
  transform: scale(0.5,0.5);
  -webkit-transform: scale(0.5,0.5);
  -ms-transform: scale(0.5,0.5);
  opacity: 0;
  transition: transform 100ms ease-in-out 0s;
  -webkit-transition: -webkit-transform 100ms ease-in-out 0s;
  -ms-transition: -ms-transform 100ms ease-in-out 0s;
}

.-immy-dialog-window.-potato-dialog-focused{
  transform: none;
  -webkit-transform: none;
  -ms-transform: none;
  opacity: 1;
}
.-immy-dialog-window.-potato-dialog-blured{
  transform: none;
  -webkit-transform: none;
  -ms-transform: none;
  opacity: 1;
}

.-immy-dialog-window.slideUp{
  transform: translate3d(0px, 40px, 0px);
  -webkit-transform: translate3d(0px, 40px, 0px);
  -ms-transform: translate3d(0px, 40px, 0px);
  opacity: 0;
  transition: transform 300ms ease-in-out 0s;
  -webkit-transition: -webkit-transform 300ms ease-in-out 0s;
  -ms-transition: -ms-transform 300ms ease-in-out 0s;
}

.-immy-dialog-window.slideUp.-potato-dialog-focused{
  transform: none;
  -webkit-transform: none;
  -ms-transform: none;
  opacity: 1;
}
.-immy-dialog-window.slideUp.-potato-dialog-blured{
  transform: none;
  -webkit-transform: none;
  -ms-transform: none;
  opacity: 0.5;
}
@media screen and (min-width: 768px){
  .-immy-dialog-window.slideUp:nth-of-type(2){margin-bottom: 10px;margin-left: 10px;}
  .-immy-dialog-window.slideUp:nth-of-type(3){margin-bottom: 20px;margin-left: 20px;}
  .-immy-dialog-window.slideUp:nth-of-type(4){margin-bottom: 30px;margin-left: 30px;}
  .-immy-dialog-window.slideUp:nth-of-type(5){margin-bottom: 40px;margin-left: 40px;}
  .-immy-dialog-window.slideUp:nth-of-type(6){margin-bottom: 50px;margin-left: 50px;}
}
@media screen and (max-width: 768px){
  .-immy-dialog-window.slideUp:nth-of-type(2){margin-bottom: 10px;}
  .-immy-dialog-window.slideUp:nth-of-type(3){margin-bottom: 20px;}
  .-immy-dialog-window.slideUp:nth-of-type(4){margin-bottom: 30px;}
  .-immy-dialog-window.slideUp:nth-of-type(5){margin-bottom: 40px;}
  .-immy-dialog-window.slideUp:nth-of-type(6){margin-bottom: 50px;}
}
.-immy-tip{
  width: 502px;
  height: auto;
  text-align: center;
  padding: 0;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 0 6px rgba(0,0,0,.4);
  z-index: 30;
  overflow: hidden;

  .-immy-tip-title{
    font-size: 18px;
    color: #003399;
    margin: 17px 0 20px;

    i{
      display: inline-block;
      width: 24px;
      height: 24px;
      margin-right: 9px;
      position: relative;
      top: 6px;
    }

    span {
      font-size: 18px;
    }
    i.ask{
      @include background('/images/ui/icon-ask.png',24px,24px,center,center);
    }
    i.succ{
      @include background('/images/ui/tipson.png',24px,24px,center,center);
    }
    i.fail{
      @include background('/images/ui/tipfail.png',24px,24px,center,center);
    }

  }

  .-immy-tip-note{
    font-size: 14px;
    color: #b3b5b7;
    padding: 0 0 26px;

    a{
      color: #2A2E33;
    }
  }
}
.-immy-tip-img{
  @extend .-immy-tip;

  height: 110px;
  text-align: left;

  img{
    display: inline-block;
    width: 174px;
    height: 108px;

  }
  .-immy-tip-info{
    display: inline-block;
    width: 325px;
    height: 108px;
    padding: 10px 15px;
    vertical-align: top;

    .-immy-tip-title{
      margin: 10px 0 12px;
    }
  }

}
